<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../js/bootstrap-3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/edit_personage.css">
</head>
<body>
<header class="header">
  <div class="logo-box"><img src="../images/logo.png" alt=""></div>
  <ul class="nav">
    <li>手机端</li>
    <li>发布房源</li>
    <li>故事</li>
    <li>消息</li>
    <li>帮助</li>
    <li onclick="personageFn()"><img class="img-circle" src="https://z1.muscache.cn/im/pictures/user/0eecd210-2706-4f2e-9785-c13cf77594b9.jpg?aki_policy=profile_small" style="width: 28px;height: 28px;"  alt=""></li>
    <!--<li>注册</li>
    <li>登录</li>-->
  </ul>
</header>
<div class="personBox">
  <div class="personageBox">
    <ul>
      <li><a href="./edit_personage.html">编辑个人资料</a></li>
    </ul>
  </div>
</div>
<div class="container-fluid max-w1080" style="margin-top: 24px;">
  <div class="row">
    <div class="col-xs-3 leftContent">
      <ul>
        <li><a href="edit_personage.html">编辑个人资料</a></li>
        <li><a href="edit_portrait.html" class="active">照片</a></li>
        <li><a href="edit_verification.html">信任和验证</a></li>
        <li><a href="edit_evaluate.html">评价</a></li>
      </ul>
      <a href="personage.html" class="lookOver">查看个人资料</a>
    </div>
    <div class="col-xs-9 rightContent">
      <div class="panel">
        <div class="panel-header">个人头像</div>
        <div class="panel-body">
          <div class="row">
            <div class="col-lg-4 text-center">
              <div class="profile_pic_container picture-main space-sm-2 space-md-2" data-picture-id="478561447">
                <div class="media-photo profile-pic-background">
                  <img alt="Zhihong" height="225" src="https://z1.muscache.cn/im/pictures/user/0eecd210-2706-4f2e-9785-c13cf77594b9.jpg?aki_policy=profile_x_medium" title="Zhihong" width="225">
                </div>
                <div class="media-photo media-round">
                  <img alt="Zhihong" class="img-circle" height="225" src="https://z1.muscache.cn/im/pictures/user/0eecd210-2706-4f2e-9785-c13cf77594b9.jpg?aki_policy=profile_x_medium" title="Zhihong" width="225">
                </div>
                <button class="picture-tile-delete overlay-btn" data-behavior="tooltip" aria-label="删除" tabindex="0">
                  <i class="icon icon-trash"></i>
                </button>
              </div>
            </div>
            <div class="col-lg-8">
              <ul class="list-layout picture-tiles clearfix ui-sortable"></ul>
              <p>
                清晰的正面脸部照片是房东和房客互相认识对方的重要途径。您能想象把自己的房子租给一只猫吗？
                请确保使用能够清楚显示您面部的照片，并确认其中不包含任何您不希望其他房东或房客看到的个人或敏感信息。
              </p>
              <div class="row row-condensed">
                <div class="">
                  <span class="file-input-container">
                    <form accept-charset="UTF-8" action="https://www.airbnbchina.cn/users/ajax_image_upload" enctype="multipart/form-data" id="ajax_upload_form" method="post" name="ajax_upload_form" target="upload_frame"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="V4$.airbnbchina.cn$H1T9GgWajKA$mP02TXHF6t_MQ8ndesKpPrAXMxf19Dx-Uj2oaEac8R8="></div>
                      <input id="user_id" name="user_id" type="hidden" value="184021841">
                      <input id="callback" name="callback" type="hidden" value="EditProfile">
                      <input accept="image/*" id="user_profile_pic" name="user[profile_pic]" tabindex="0" type="file">
                      <label class="btn btn-block btn-large" for="user_profile_pic" role="button">从您的计算机上传照片</label>
                    </form>
                    <iframe id="upload_frame" name="upload_frame" style="display:none;"></iframe>
                  </span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<footer class="footer">
  <div class="_2h22gn">
    <div class="footer-box">
      <section class="list">
        <div class="list-con">
          <h4 class="f-tit">爱彼迎</h4>
          <ul>
            <li><a href="#">工作机会</a></li>
            <li><a href="#">新闻</a></li>
            <li><a href="#">政策</a></li>
            <li><a href="#">政策</a></li>
            <li><a href="#">政策</a></li>
          </ul>
        </div>
      </section>
      <section class="list">
        <div class="list-con">
          <h4 class="f-tit">爱彼迎</h4>
          <ul>
            <li><a href="#">工作机会</a></li>
            <li><a href="#">新闻</a></li>
            <li><a href="#">政策</a></li>
            <li><a href="#">政策</a></li>
            <li><a href="#">政策</a></li>
          </ul>
        </div>
      </section>
      <section class="list">
        <div class="list-con">
          <h4 class="f-tit">爱彼迎</h4>
          <ul>
            <li><a href="#">工作机会</a></li>
            <li><a href="#">新闻</a></li>
            <li><a href="#">政策</a></li>
            <li><a href="#">政策</a></li>
            <li><a href="#">政策</a></li>
          </ul>
        </div>
      </section>
    </div>
  </div>
</footer>
</body>
<script src="../js/jquery-2.1.1.js"></script>
<script src="../js/bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script>
  function personageFn(){
    $(".personBox").fadeToggle(10);
  }
</script>
</html>
